<style>
    .panel-header, .panel-body {
        border-width: 0px;
    }

    .datagrid, .combo-p {
        border: solid 1px #D4D4D4;
    }

    .panel-title {
        cursor: pointer
    }

    .inlineblock {
        margin-top: 10px;
    }

    .inlineblock div {
        display: inline-block;
    }

    .inlineblock div label {
        display: inline-block;
        top: 5px;
    }

    .newform {
        width: 70%;
    }

    .editform {
        width: 70%;
    }

    .searchClass {
        /* 		margin-left: 5%;
                 */		margin-top: 1%;
    }

    .searchClass label {        width: 9%;
        font-weight: bold;
        text-align: center;
    }

    #Search {
        float: right;
        margin-right: 4%;
        width: 14%;
    }
    .file {
        position: relative;
        display: inline-block;
        background: #D0EEFF;
        border: 1px solid #99D3F5;
        border-radius: 4px;
        padding: 4px 12px;
        overflow: hidden;
        color: #1E88C7;
        text-decoration: none;
        text-indent: 0;
        line-height: 20px;
    }
    .file input {
        position: absolute;
        font-size: 100px;
        right: 0;
        top: 0;
        opacity: 0;
    }
    .file:hover {
        background: #AADFFD;
        border-color: #78C3F3;
        color: #004974;
        text-decoration: none;
    }
</style>
<div class="row">
    <div id="breadcrumb" class="col-xs-12" style="margin-bottom: 10px">
        <a href="#" class="show-sidebar"> <i class="fa fa-bars"></i>
        </a>
        <ol class="breadcrumb pull-left">
            <li><a href="#">用户管理</a></li>
            <li><a href="#">用户管理</a></li>
        </ol>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-header">
                <div class="box-name">
                    <i class="fa fa-clipboard"></i> <span>用户管理</span>
                </div>
                <div class="box-icons">
                    <a class="collapse-link"> <i class="fa fa-chevron-up"></i>
                    </a> <a class="expand-link"> <i class="fa fa-expand"></i>
                </a> <a class="close-link"> <i class="fa fa-times"></i>
                </a>
                </div>
                <div class="no-move"></div>
            </div>
            <div class="box-content table-responsive" style="padding-top: 15px">

                <div class="panel panel-default" style="border: 1px solid #CCC; height: auto;">
                    <div class="panel-heading" role="tab" id="headingOne">
                        <h4 class="panel-title" data-toggle="collapse" data-target="#collapseForAdd">
                            功能面板 <span class="fa fa-chevron-down" style="float: right"></span>
                        </h4>
                    </div>

                    <div id="collapseForAdd" class="panel-collapse collapse in" role="tabpanel"
                         aria-labelledby="headingOne">
                        <div class="panel-body">
                            <div class="container-fluid" style="margin-top: 10px;">
                                <!--操作-->
                                <div id="operationpanel" class="col-xs-12">
                                    <div class="col-xs-12 btn-menu-top-minus" style="margin-top:5px;">
                                        <button class="btn btn-primary btn-sm addbook" data-toggle="modal" data-target="#exampleModal">
                                            <i class="fa fa-file-o"></i>添加人员信息
                                        </button>
                                        <!--<button class="btn btn-primary btn-sm editbook" data-toggle="modal" data-target="#exampleModal">-->
                                            <!--<i class="fa fa-file-o"></i>修改人员信息-->
                                        <!--</button>-->
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>

                <!--主信息面板 S-->
                <div class="panel panel-default" style="border: 1px solid #CCC;">
                    <div class="panel-heading" role="tab" id="headingTwo">
                        <h4 class="panel-title" data-toggle="collapse" data-target="#collapseForCourseTable">
                            公告基础信息<span class="fa fa-chevron-down" style="float: right"></span>
                        </h4>
                    </div>
                    <div id="collapseForCourseTable" class="panel-collapse collapse in" role="tabpanel"
                         aria-labelledby="headingTwo">
                        <div class="panel-body" style="overflow: hidden;">
                            <!--搜索区域-->
                            <div class="searchClass row">
                                <div class="col-xs-12">
                                    <label style="width: 5%;">关键字</label>
                                    <input class="SearchForm form-control"style="width:20%" placeholder="名称|手机号码|昵称|职务" name="keyword" type="text" id="keyword"/>
                                    <label style="width: 5%;">省</label>
                                    <select class="SearchForm form-control" id="province" name="province" style="height: 33px;width:15%">
                                        <option value="">不限</option>
                                    </select>
                                    <label style="width: 5%;">市</label>
                                    <select class="SearchForm form-control" id="city" name="city" style="height: 33px;width:15%">
                                        <option value="">不限</option>
                                    </select>
                                    <label style="width: 5%;">区</label>
                                    <select class="SearchForm form-control" id="area" name="area" style="height: 33px;width:15%">
                                        <option value="">不限</option>
                                    </select>
                                    <br/>
                                    <label style="width: 5%;">状态</label>
                                    <select class="SearchForm form-control" id="user_status" name="user_status" style="height: 33px;width:15%">
                                        <option value="">不限</option>
                                        <option value="1">启用</option>
                                        <option value="2">停用</option>
                                    </select>
                                    <label style="width: 5%;">认证状态</label>
                                    <select class="SearchForm form-control" id="user_personal_status" name="user_personal_status" style="height: 33px;width:15%">
                                        <option value="">不限</option>
                                        <option value="1">未认证</option>
                                        <option value="2">通过</option>
                                        <option value="3">未通过</option>
                                        <option value="4">审核中</option>
                                    </select>
                                    <label style="margin-top:20px">发布时间</label>
                                    <input style="width:16%"class="SearchForm form-control" type="text" placeholder="开始时间" id="start" onclick="WdatePicker({lang:'zh-cn',dateFmt:'yyyy-MM-dd HH:mm:ss'})"/>
                                    <input style="width:16%"class="SearchForm form-control" type="text" placeholder="结束时间" id="end" onclick="WdatePicker({lang:'zh-cn',dateFmt:'yyyy-MM-dd HH:mm:ss'})"/>


                                </div>
                            </div>
                            <br/>
                            <button id="Search" class="btn btn-primary btn-xs" style="height: 30px;margin-left: 30px">
                                <i class="fa fa-search"></i>&nbsp;&nbsp;搜索
                            </button>
                            <button id="Reset" class="btn btn-primary btn-sm" style="width:120px;float: right;">
                                清空查询条件
                            </button>
                        </div>
                        <table id="datatable_noticeinfo" data-size="15">

                        </table>
                        <div id ="pp" style = "background:#efefef; border:1px solid #ccc;width:100%" > </div>
                    </div>
                </div>
                <!--主信息面板 E-->
            </div>
        </div>
    </div>
</div>
<script>
    $(function () {
        $.ajax({
            url: 'super/User/province',
            type: 'POST',
            dataType: 'json',//返回的数据类型
            success:function (data) {
                $("#province").html("");
                var html = " <option value=''>不限</option>";
                $.each(data, function (i, item) {
                    html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
                });
                $("#province").append(html);

            }
        })
    })
    $("#province").on("change",function () {
        var city = $("#province").val();
        $("#area").html("");
        var html = " <option value=''>不限</option>";
        $("#area").append(html);

        getCity(city);
    })
    $("#city").on("change",function () {
        var city = $("#city").val();
        getArea(city);
    })
    function getCity(city){
        $.ajax({
            url: 'super/User/city',
            data: {city: city},
            type: 'POST',
            dataType: 'json',//返回的数据类型
            success: function (data) {
                var cityArray =  data.cityArray;
                $("#city").html("");
                var html = " <option value=''>不限</option>";
                $.each(cityArray, function (i, item) {
                    html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
                });
                $("#city").append(html);
            }
        })
    }
    function getArea(area){
        $.ajax({
            url: 'super/User/area',
            data: {area: area},
            type: 'POST',
            dataType: 'json',//返回的数据类型
            success: function (data) {
                var cityArray =  data.cityArray;
                $("#area").html("");
                var html = " <option value=''>不限</option>";
                $.each(cityArray, function (i, item) {
                    html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
                });
                $("#area").append(html);
            }
        })
    }
</script>
<script>
    /**
     * 获得搜索参数
     * @param params
     * @returns {Object}
     */
    function getSearchParams(params) {
        var searchParams = new Object();
        if (params != undefined) {
            searchParams = params;
        }
        $('.SearchForm').each(function () {
            var param = $(this).val().trim();
            if (param == undefined)
                param = '';
            searchParams[$(this).attr('id')] = param;
        });
        return searchParams;
    }

    $(function () {
        var cellwidth = ($(".box-content.table-responsive").width() - 55) / 11;
        var psval = $('#datatable_noticeinfo').attr('data-size');
        if (psval == undefined || psval == "") {
            psval = 10;
        }
        //页面首次加载获取数据
        $('#datatable_noticeinfo').datagrid({
            striped: true,
            remoteSort: false,
//            idField: 'adv_id',
            collapsible: true,
            fit: false,
            url: 'super/User/getUserInfo',//数据源路径
            loadMsg: '请等待数据载入....',
            pagination: true,
            rownumbers: true,
            fitColumns: false,
            nowrap:false,
            singleSelect: true,
            pageSize: psval,
            pageList: [psval, psval * 2, psval * 3, psval * 4, psval * 5],
            columns: [[
                {
                    field: 'user_username',
                    title: '昵称',
                    align: 'center',
                    width: cellwidth,
                    sortable: true
                }, {
                    field: 'user_phone',
                    title: '手机号码',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                }, {
                    field: 'user_post',
                    title: '职务',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,

                }, {
                    field: 'real_name',
                    title: '真实姓名',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,


                }
                , {
                    field: 'user_area',
                    title: '所在城市',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,

                }, {
                    field: 'region_name',
                    title: '从事行业',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                }
                , {
                    field: 'user_register',
                    title: '注册方式',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                    formatter:function(value,row,index){
                        if(value==1){
                            return "<span style='color:green;font-weight: bold'>前台注册</span>";
                        }else if(value==2){
                            return "<span style='color:#F17A02;font-weight: bold'>后台注册</span>";
                        }else if(value==3){
                            return "<span style='color:red;font-weight: bold'>导入注册</span>";
                        }
                    }
                }
                , {
                    field: 'user_status',
                    title: '状态',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                    formatter:function(value,row,index){
                        if(value==1){
                            return "<span style='color:green;font-weight: bold'>启用</span>";
                        }else{
                            return "<span style='color:#F17A02;font-weight: bold'>停用</span>";
                        }
                    }
                }
                , {
                    field: 'user_personal_status',
                    title: '认证状态',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                    formatter:function(value,row,index){
                        if(value==1){
                            return "<span style='color:indianred;font-weight: bold'>未认证</span>";
                        }else if(value==2){
                            return "<span style='color:green;font-weight: bold'>通过</span>";
                        }else if(value==3){
                            return "<span style='color:red;font-weight: bold'>未通过</span>";
                        }else{
                            return "<span style='color:#F17A02;font-weight: bold'>审核中</span>";
                        }
                    }
                }
                , {
                    field: 'user_official',
                    title: '是否是官方人员',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                    formatter:function(value,row,index){
                        if(value==1){
                            return "<span style='color:indianred;font-weight: bold'>是</span>";
                        }else{
                            return "<span style='color:green;font-weight: bold'>否</span>";
                        }
                    }
                }
                , {
                    field: 'user_time',
                    title: '注册时间',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                }
                , {
                    field: 'user_id',
                    title: '操作',
                    align: 'center',
                    width: cellwidth,
                    sortable: true,
                    formatter:function(value,row,index){
                        var html='';
                        if(row.user_status==1){
                             html +="<a onclick='TyReleaseInfo(this);' style='color:red;margin-left:5px' name='"+value+"' href='JavaScript:;'>停用</a>";
                        }else{
                             html +="<a onclick='QyReleaseInfo(this);' style='color:green;margin-left:5px' name='"+value+"' href='JavaScript:;'>启用</a>";
                        }
                        if(row.user_personal_status==4){
                             html +="<a onclick='RzReleaseInfo(this);' style='color:blueviolet;margin-left:5px' name='"+value+"' href='JavaScript:;'>审核</a>";
                        }
                        html +="<a onclick='UpdateInfo(this);' style='color:cornflowerblue;margin-left:5px' name='"+value+"' href='JavaScript:;'>修改</a><br/>";
                        if(row.user_official==2){
                            html +="<a onclick='Setup(this);' style='color:cornflowerblue;margin-left:5px' name='"+value+"' href='JavaScript:;'>设置官方人员</a>";
                        }else{
                            html +="<a onclick='lower(this);'  style='color:mediumvioletred;margin-left:5px' name='"+value+"' href='JavaScript:;'>取消官方人员</a>";
                        }
                        return html;
                    }
                }
            ]],
            onBeforeLoad: function (param) {
                param = getSearchParams(param);
            },

        });

        //搜索
        $('#Search').click(function () {
            $('#datatable_noticeinfo').datagrid('reload');
        });
        //清空搜索条件
        $("#Reset").click(function() {
            $('.SearchForm').val('');
        });

        //添加
        $('.addbook').click(function () {
            var content = "";
            $.ajax({
                url: 'super/User/addLife',
                type: 'POST',
                dataType: 'HTML',//返回的数据类型
                success: function (updatemodalhtml) {
                    content = updatemodalhtml;
                    //弹出添加框
                    $.TeachDialog({
                        title: '新增用户',
                        content: content,
                        showCloseButton: true,
                        largeSize: true,
                        showCloseButtonName: '关闭',
                        otherButtons: ['保存'],
                        otherButtonStyles: ['btn-primary'],
                        clickButton: function (sender, modal, index) {
                            var formData = new FormData($("#updateForm" )[0]);
                            $.ajax({
                                url: 'super/User/insertLife',
                                data: formData,
                                type: 'POST',
                                dataType: 'JSON',
                                async: false,
                                cache: false,
                                contentType: false,
                                processData: false,
                                success: function (returnData) {
                                    if (returnData.status == 0) {
                                        layer.open({
                                            content: returnData.msg
                                        });
                                    } else {
                                        modal.modal('hide');
                                        $('#datatable_noticeinfo').datagrid('reload');
                                        window.location.reload();
                                    }
                                },
                                error: function () {
                                    layer.open({
                                        content: '系统异常，请联系管理员'
                                    });
                                },

                            });

                        },
                    });
                },
                error: function () {
                    layer.open({
                        content: '系统异常，请联系管理员'
                    });
                    return;
                }
            });
        });
        
//        $('.editbook').click(function () {
//            var row = $('#datatable_noticeinfo').datagrid('getSelections');
//            if (row.length<1) {
//                $.TeachDialog({
//                    content: '请选择一行数据进行修改！',
//                });
//                return;
//            }
//            if (row.length>1) {
//                $.TeachDialog({
//                    content: '只能选择一行进行修改！',
//                });
//                return;
//            }
//            var content = "";
//            $.ajax({
//                url: 'super/User/updateUser',
//                data: "nid=" + row[0].user_id,
//                type: 'POST',
//                dataType: 'HTML',//返回的数据类型
//                success: function (updatemodalhtml) {
//                    content = updatemodalhtml;
//                    //弹出修改框
//                    $.TeachDialog({
//                        title: '修改人员信息',
//                        content: content,
//                        showCloseButton: true,
//                        showCloseButtonName: '关闭',
//                        otherButtons: ['保存'],
//                        otherButtonStyles: ['btn-primary'],
//                        clickButton: function (sender, modal, index) {
////                            var formData = new FormData($("#updateForm" )[0]);
//                            $.ajax({
//                                url: 'super/User/updateUserInfo',
//                                data: $("#updateForm").serialize(),
//                                type: 'POST',
//                                dataType: 'JSON',
////                                async: false,
////                                cache: false,
////                                contentType: false,
////                                processData: false,
//                                success: function (returnData) {
//                                    if (returnData.status == 0) {
////                                        $.TeachDialog({
////                                            content: returnData.msg
////                                        });
//                                        layer.open({
//                                            content: returnData.msg
//                                        });
//                                    } else {
//                                        modal.modal('hide');
//                                        // $.TeachDialog({
//                                        //     content: returnData.msg
//                                        // });
//                                        $('#datatable_noticeinfo').datagrid('reload');
//                                    }
//                                },
//                                error: function () {
//                                    $.TeachDialog({
//                                        content: '系统异常，请联系管理员'
//                                    });
//                                },
//
//                            });
//
//                        },
//                    });
//                },
//                error: function () {
//                    $.TeachDialog({
//                        content: '系统异常，请联系管理员'
//                    });
//                    return;
//                }
//            });
//        })

    });
    //修改
    function UpdateInfo(c) {
        var content = "";
        var cid = c.name;
        $.ajax({
            url: 'super/User/updateUser',
            data: "nid=" + cid,
            type: 'POST',
            dataType: 'HTML',//返回的数据类型
            success: function (updatemodalhtml) {
                content = updatemodalhtml;
                //弹出修改框
                $.TeachDialog({
                    title: '修改人员信息',
                    content: content,
                    showCloseButton: true,
                    showCloseButtonName: '关闭',
                    otherButtons: ['保存'],
                    otherButtonStyles: ['btn-primary'],
                    clickButton: function (sender, modal, index) {
//                            var formData = new FormData($("#updateForm" )[0]);
                        $.ajax({
                            url: 'super/User/updateUserInfo',
                            data: $("#updateForm").serialize(),
                            type: 'POST',
                            dataType: 'JSON',
//                                async: false,
//                                cache: false,
//                                contentType: false,
//                                processData: false,
                            success: function (returnData) {
                                if (returnData.status == 0) {
                                    layer.open({
                                        content: returnData.msg
                                    });
                                } else {
                                    modal.modal('hide');
                                    // $.TeachDialog({
                                    //     content: returnData.msg
                                    // });
                                    $('#datatable_noticeinfo').datagrid('reload');
                                }
                            },
                            error: function () {
                                layer.open({
                                    content: '系统异常，请联系管理员'
                                });
                            },

                        });

                    },
                });
            },
            error: function () {
                layer.open({
                    content: '系统异常，请联系管理员'
                });
                return;
            }
        });
    }
    /***
     * 停用
     * */
    function TyReleaseInfo(c) {
        var cid = c.name;
        if(confirm('确认停用此人员吗？')){
            $.ajax({
                url: 'super/User/updateLife',
                data: 'cid=' + cid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    if (returnData.status == 0) {
                        $.TeachDialog({
                            content: returnData.msg
                        });
                    } else {

                        $.TeachDialog({
                            content: returnData.msg,
                            showCloseButton: false,
                        });
                        $('#datatable_noticeinfo').datagrid('reload');

                    }
                },
                error: function () {
                    layer.open({
                        content: '系统异常，请联系管理员'
                    });
                },

            });
        }
    }
    function  Setup(c) {
        var cid = c.name;
        if(confirm('确认设置为官方人员？')){
            $.ajax({
                url: 'super/User/Setup',
                data: 'cid=' + cid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    if (returnData.status == 0) {
                        $.TeachDialog({
                            content: returnData.msg
                        });
                    } else {

                        $.TeachDialog({
                            content: returnData.msg,
                            showCloseButton: false,
                        });
                        $('#datatable_noticeinfo').datagrid('reload');

                    }
                },
                error: function () {
                    layer.open({
                        content: '系统异常，请联系管理员'
                    });
                },

            });
        }
    }
    function  lower(c) {
        var cid = c.name;
        if(confirm('确认取消设置为官方人员？')){
            $.ajax({
                url: 'super/User/lower',
                data: 'cid=' + cid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    if (returnData.status == 0) {
                        $.TeachDialog({
                            content: returnData.msg
                        });
                    } else {

                        $.TeachDialog({
                            content: returnData.msg,
                            showCloseButton: false,
                        });
                        $('#datatable_noticeinfo').datagrid('reload');

                    }
                },
                error: function () {
                    layer.open({
                        content: '系统异常，请联系管理员'
                    });
                },

            });
        }
    }

    /**
     * 启用
     * @param c
     */
    function QyReleaseInfo(c) {
        var cid = c.name;
        if(confirm('确认启用此人员吗？')){
            $.ajax({
                url: 'super/User/refuseLife',
                data: 'cid=' + cid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    if (returnData.status == 0) {
                        $.TeachDialog({
                            content: returnData.msg
                        });
                    } else {

                        $.TeachDialog({
                            content: returnData.msg,
                            showCloseButton: false,
                        });
                        $('#datatable_noticeinfo').datagrid('reload');

                    }
                },
                error: function () {
                    layer.open({
                        content: '系统异常，请联系管理员'
                    });
                },

            });
        }
    }
    /**
     * 认证
     * @param c
     * @constructor
     */
    function RzReleaseInfo(c) {
        var cid = c.name;
        var content = "";
        $.ajax({
            url: 'super/User/identification',
            data: "cid=" + cid,
            type: 'POST',
            dataType: 'HTML',//返回的数据类型
            success: function (updatemodalhtml) {
                content = updatemodalhtml;
                //弹出修改框
                $.TeachDialog({
                    title: '认证用户',
                    content: content,
                    largeSize:true,
                    modalId: null,
                    animation: null,
                    showCloseButton: true,
                    showCloseButtonName: '关闭',
                    otherButtons: ['保存'],
                    otherButtonStyles: ['btn-primary'],
                    clickButton: function (sender, modal, index) {
                        $.ajax({
                            url: 'super/User/updateIdentification',
                            data: $("#updateForm").serialize(),
                            type: 'POST',
                            dataType: 'JSON',
                            success: function (returnData) {
                                if (returnData.status == 0) {
                                    layer.open({
                                        content: returnData.msg
                                    });
                                } else {
                                    modal.modal('hide');
                                    $('#datatable_noticeinfo').datagrid('reload');
                                }
                            },
                            error: function () {
                                layer.open({
                                    content: '系统异常，请联系管理员'
                                });
                            },

                        });

                    },
                });
            },
            error: function () {
                layer.open({
                    content: '系统异常，请联系管理员'
                });
                return;
            }
        });
    }
</script>






